<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>WebSocket</title>
</head>
<textarea style="width:500px;height: 200px;" id="text-msg"></textarea>
<br/>
<input id="input-msg" />
<button>Send</button>
<body>
<script src="assets/js/jquery.min-1.11.3.js"></script>
<script type="text/javascript">

    function appendMsg(msg) {
        var t = $('#text-msg');
        var str = t.val() + msg;
        t.val(str + "\r\n");
    }

    var ws;
    $(function () {
        if ('WebSocket' in window) {
            ws = new WebSocket('ws://localhost:8081/ws/substart/' + new Date().getMilliseconds())
        } else if ('MozWebSocket' in window) {
            ws = new MozWebSocket('ws://localhost:8081/ws/substart/' + new Date().getMilliseconds());
        } else {
            alert('浏览器不支持 wesocket!');
        }

        ws.onmessage = function (e) {
            appendMsg(e.data); //来自服务器的消息
        };
        ws.onclose = function (e) {
            appendMsg('连接中断');
        };
        ws.onopen = function (e) {
            appendMsg('已连接');
        };

        $('button').bind('click',function () {
            ws.send($('#input-msg').val());
        });
    });

</script>
</body>

</html>